<template>
	<view>
		<view class="u_flex">
			<view @click="chang('subtract')">-</view>
			<input v-model="num"/>
			<view @click="chang('add')">+</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			index:{
				type:Number,
				default:null
			},
			value:{
				type:Number,
				default:0
			}
		},
		data(){
			return{
				num:this.value
			}
		},
		methods:{
			chang(e){
				let obje = {};
				if(e == "add"){
					this.num ++;
				}else{
					if(this.num > 0){
						this.num --;
					}
				}
				obje = Object.assign({
					value:this.num,
					index:this.index,
					mode:e
				});
				this.$emit('variation',obje);
			}
		}
	}
</script>

<style scoped lang="scss">
	.u_flex{
		display: flex;
		input{
			background-color:#F6F6F6;
			width:80rpx;
			height:35rpx;
			font-weight:500;
			padding-top:5rpx;
			padding-bottom:5rpx;
			font-size:25rpx;
			//border:1px solid red;
			text-align: center;
		}
		view{
			width:50rpx;
			height:40rpx;
			line-height:40rpx;
			text-align: center;
			font-size:33rpx;
			//border:1px solid red;
		}
	}
</style>
